<template>
	<view scroll-y="true" :class="view + ' wrap ' + (isIPX?'scroll_view_X': '')" @tap="onTap" upper-threshold="-50"
	 :scroll-into-view="toView">
		<view class="content" style="position: fixed;top:0; z-index: 1000;">
			<gbromarquee v-if="broadcastData.length>0" broadcastType='text' @changeEvent='testClick'  direction="left"
			 :broadcastIconIsDisplay="true" :broadcastData='broadcastData' :broadcastStyle='broadcastStyle'  ref='son' @click="guanbi" style="width: 100%">
			</gbromarquee>
		</view>

		<view class="message" v-for="item in chatMsg" :key="item.mid" :id="item.mid" @longtap="msglongtap(item)">
			<!-- <view class="time">
				<text class="time-text">{{ item.time }}</text>
      </view>-->
			<view class="main" :class="item.style">
				<view class="user">
					<!-- yourname：就是消息的 from -->
					<!-- <text class="user-text">{{ item.yourname + ' ' + item.time}}</text> -->
					<text class="user-text">{{ item.nickname}} &nbsp;&nbsp;&nbsp;<text v-show="item.yourname==myusername&&item.username!='机器人'&&item.totalfen!=null">分:{{item.totalfen}}</text></text>
				</view>
				<image class="avatar" :src="item.headimg" style="border-radius: 17%;" @click="goinfofriend(item)"/>
				<view class="msg" >
					<image class="err" :class="(item.style == 'self' && item.isFail) ?  'show' : 'hide'" src="/static/images/msgerr.png" />

					<!-- <image v-if="item.style == 'self'" src="/static/images/poprightarrow@2x.png" class="msg_poprightarrow" /> -->
					<image v-if="item.style == ''" src="/static/images/popleftarrow@2x.png" class="msg_popleftarrow" />
					<view v-if="item.msg.type == 'img' || item.msg.type == 'video'">
						<image v-if="item.msg.type == 'img'" class="avatar" :src="item.msg.data" style="width:90px; height:120px; margin:2px auto;"
						 mode="aspectFit" @tap="previewImage" :data-url="item.msg.data" />
						<!-- <video v-if="item.msg.type == 'video'" :src="item.msg.data" controls style="width:300rpx;"/> -->
					</view>
					<audio-msg v-if="item.msg.type == 'audio'" :msg="item"></audio-msg>
					<!-- 普通文本 -->
						<view v-if="item.ext.lzid != 520&&item.ext.lzid != 52&&item.ext.lzid != 689&&item.ext.lzid != 369&&item.ext.cs!=1&&item.ext.status!=2&&item.ext.type!=1&&item.ext.type!=3&&item.ext.lzid !=765&&item.ext.lzid !=567">
							<view v-if="item.msg.type == 'txt' || item.msg.type == 'emoji'">

								<view class="template" v-for="(d_item, d_index) in item.msg.data" :key="d_index">
									
								
										<text v-if="d_item.type == 'txt'&&item.ext.type!=0" class="msg-text" style="float:left;" selectable="true">{{ d_item.data }}<br><text style="font-size: 14px;">{{item.time}}</text></text>
									<image v-if="d_item.type == 'emoji'" class="avatar" :src="'/static/images/faces/' + d_item.data" style="width:25px; height:25px; margin:0 0 2px 0; float:left;" />
								</view>
							</view>
						</view>
						<!-- 红包提示 -->
						<view>
							<view v-if="item.msg.type == 'txt'">
								<view class="template" v-for="(d_item, d_index) in item.msg.data" :key="d_index" v-if="item.ext.lzid==765&&item.ext.fb==myname">
										<text selectable="true" v-if="d_item.type == 'txt'&&item.ext.lzid==765" class="msg-text" style="text-align: center;font-size: 10px;"><image src="/static/moneybao/lingquhongbao.png" mode="" style="width: 15px;height: 20px;padding-right: 5px;"></image>{{ d_item.data }}</text>
								</view>
								<view class="template" v-for="(d_item, d_index) in item.msg.data" :key="d_index" v-if="item.ext.lzid==567&&item.ext.fb!=myname">
										<text selectable="true" v-if="d_item.type == 'txt'&&item.ext.lzid==567" class="msg-text" style="text-align: center;font-size: 10px;"><image src="/static/moneybao/lingquhongbao.png" mode="" style="width: 15px;height: 20px;padding-right: 5px;"></image>{{ d_item.data }}</text>
								</view>
							</view>
						</view>
						
					<!-- 机器人回复消息 -->
					<view v-if="item.ext.lzid == 520">
						<image  class="avatar" src="/static/images/group@2x.png" style="position: absolute;left: 0;margin-left: -20%;"/>
						<view class="template" v-for="(d_item, d_index) in item.msg.data" :key="d_index">
							<text v-if="d_item.type == 'txt'&&item.ext.type!=0" class="msg-text" style="float:left;">{{ d_item.data }}</text>
						</view>
					</view>
					<!-- 中雷提示 -->
					<view v-if="item.username=='机器人'&&item.ext.cs==1" style="display: flex;flex-direction: column;background-color: #FFFFFF;padding: 10px;border-radius: 10px;">
						<image  class="avatar" src="/static/images/group@2x.png" style="position: absolute;left: 0;margin-left: -30%;"/>
						<text style="font-size: 15px;margin:3px 0;">名:{{item.ext.name}}</text>
						<text style="font-size: 15px;margin:3px 0;">发包:{{item.ext.bao}}</text>
						<text style="color: #000000;font-weight: bold;font-size: 15px;margin:3px 0;">出雷:{{item.ext.cl}}</text>
						<text style="color: #000000;font-weight: bold;font-size: 15px;margin:3px 0;">赔率:{{item.ext.pl}}倍 共反{{item.ext.pmoney}}</text>
						<text style="font-size: 15px;margin:3px 0;">时间:{{item.ext.time}}</text>
					</view>
					<!-- 个人信息记录 -->
					<view v-if="item.style==''&&item.username=='机器人'&&item.ext.lzid==369" style="display: flex;flex-direction: column;background-color: #FFFFFF;border-radius: 10px;">
						<image  class="avatar" src="/static/images/group@2x.png" style="position: absolute;left: 0;margin-left: -30%;"/>				
						<text style="font-size: 15px;margin:3px 0;">{{item.ext.username}}</text>
						<text style="font-size: 15px;margin:3px 0;">当前积分余额:{{item.ext.ye}}</text>
						<text style="font-size: 15px;margin:3px 0;">输赢:{{item.ext.shuyin}}</text>
						<text style="font-size: 15px;margin:3px 0;">发包流水:{{item.ext.fbls}}</text>
						<text style="font-size: 15px;margin:3px 0;">发包数:{{item.ext.fbs}}</text>
						<text style="font-size: 15px;margin:3px 0;">平均包值:{{item.ext.tjz}}</text>
						<text style="font-size: 15px;margin:3px 0;">时间:{{item.ext.time}}</text>
					</view>
					<!-- 闭群通知 -->
				<view v-if="item.ext.lzid == 52">
					<image  class="avatar" src="/static/images/group@2x.png" style="position: absolute;left: 0;margin-left: -20%;"/>
					<view class="template" v-for="(d_item, d_index) in item.msg.data" :key="d_index">
						<text v-if="d_item.type == 'txt'&&item.ext.type!=0" class="msg-text" style="float:left;" v-html="d_item.data "></text>
					</view>
				</view>
					<!-- 邀请进群 -->
					<view v-if="item.ext.lzid == 689">
						<image  class="avatar" src="/static/images/group@2x.png" style="position: absolute;left: 0;margin-left: -20%;"/>
						<view class="template" v-for="(d_item, d_index) in item.msg.data" :key="d_index">
							<text v-if="d_item.type == 'txt'&&item.ext.type!=0" class="msg-text" style="float:left;" v-html="d_item.data "></text>
						</view>
					</view>
					<!-- 中雷返钱 -->
					<view v-if="item.ext.status==2" style="background-color: #FFFFFF;padding: 0;">
						<view class="bubble red-envelope" style="position: relative;">
							<!-- 自己发 -->
							<!-- 11111111111111111111111111{{item.colorimg}} -->
							<image v-show="item.username==item.nickname" src="/static/moneybao/duifanghongbaodise.png" style="width: 240px;height: 90px;transform: rotateY(2700deg);"></image>
							<!--&& name!=item.yourname-->
							<image v-show="item.username!=item.nickname" src="/static/moneybao/duifanghongbaodise.png" style="width: 240px;height: 90px;"></image>
							<view class="tis">
							</view>
							<view>
								<image src="/static/zhuanzhang.png" style="width: 40px;height: 40px;position: absolute;top: 12px;left: 20px;"></image>
							</view>
							<view class="blessing" style="position: absolute;bottom: 40px;left: 30%;font-size: 15px;color: #FFFFFF;display: flex;flex-direction: column;">
								<text>已收款{{ item.ext.money }}积分</text>
								<text>{{ item.ext.title }}</text>
							</view>
							<view style="width: 242px;color: #000000;position: absolute;bottom: 2px;font-size: 18px;background-color: #FFFFFF;display: flex;border-bottom-left-radius: 8px;border-bottom-right-radius: 8px;justify-content: space-between;">
								<view style="margin-left: 5px;font-size: 14px;">转账</view>
								<view style="display: flex;margin-right: 5px;">
									<view class="" style="margin-right: 5px;font-size: 15px;">
										{{item.time}}
									</view>
								</view>
							</view>
						</view>
					</view>
					<!-- 余额红包 -->
					<view style="background-color: #FFFFFF;padding: 0;">
						<view v-if="item.msg.type == 'txt'&&item.ext.type==3" class="bubble red-envelope"
						 style="position: relative;">
						 <view class="bubble red-envelope" style="position: relative;">
						 	<!-- 自己发 -->
						 	<!-- 11111111111111111111111111{{item.colorimg}} -->
						 	<image v-show="item.colorimg==false" src="/static/moneybao/duifanghongbaodise.png" style="width: 240px;height: 90px;"></image>
						 	<!--&& name!=item.yourname-->
						 	<image v-show="item.colorimg==true" src="/static/moneybao/qiangwan.png" style="width: 240px;height: 90px;"></image>
						 	<view class="tis">
						 	</view>
						 	<view>
						 		<image src="/static/zhuanzhang.png" style="width: 40px;height: 40px;position: absolute;top: 12px;left: 20px;"></image>
						 	</view>
						 	<view class="blessing" style="position: absolute;bottom: 40px;left: 30%;font-size: 15px;color: #FFFFFF;display: flex;flex-direction: column;">
						 		<text>{{ item.ext.money }}元</text>
						 		<text>{{ item.ext.beizhu }}</text>
						 	</view>
						 	<view style="width: 242px;color: #000000;position: absolute;bottom: 2px;font-size: 18px;background-color: #FFFFFF;display: flex;border-bottom-left-radius: 8px;border-bottom-right-radius: 8px;justify-content: space-between;">
						 		<view style="margin-left: 5px;font-size: 14px;">转账</view>
						 		<view style="display: flex;margin-right: 5px;">
						 			<view class="" style="margin-right: 5px;font-size: 15px;">
						 				{{item.time}}
						 			</view>
						 		</view>
						 	</view>
						 </view>
						</view>
					</view>
					<!-- 红包展示页面 -->
					<view style="background-color: #FFFFFF;padding: 0;">
						<view v-if="item.msg.type == 'txt'&&item.ext.type==0" class="bubble red-envelope" @tap="openRedEnvelope(item)"
						 style="position: relative;">
						 
							<view v-if="myname==item.yourname">
								<image v-show="item.colorimg==false" src="/static/moneybao/duifanghongbaodise.png" style="width: 240px;height: 90px;transform: rotateY(2700deg);"></image>
								<image v-show="item.colorimg==true" src="/static/moneybao/qiangwan.png" style="width: 240px;height: 90px;transform: rotateY(2700deg);"></image>
							</view>
							<view v-if="myname!=item.yourname">
								<image v-show="item.colorimg==false" src="/static/moneybao/duifanghongbaodise.png" style="width: 240px;height: 90px;"></image>
								<image v-show="item.colorimg==true" src="/static/moneybao/qiangwan.png" style="width: 240px;height: 90px;"></image>
							</view>
							<view class="tis">
							</view>
							<view>
								<image src="/static/moneybao/hongbao.png" style="width: 30px;height: 40px;position: absolute;top: 24px;left: 20px;"></image>
							</view>
							<view class="blessing" style="position: absolute;bottom: 50px;left: 30%;font-size: 15px;color: #FFFFFF;">
								金额:{{ item.ext.money }}&nbsp;&nbsp;&nbsp;包数:{{ item.ext.num }}<br>雷值:{{ item.ext.beizhu }}
							</view>
							<view style="width: 242px;color: #000000;position: absolute;bottom: 2px;font-size: 18px;background-color: #FFFFFF;display: flex;border-bottom-left-radius: 8px;border-bottom-right-radius: 8px;justify-content: space-between;">
								<view style="margin-left: 5px;font-size: 14px;">积分红包</view>
								<view style="display: flex;margin-right: 5px;">
									<view class="" style="margin-right: 5px;font-size: 12px;">
										{{item.ext.time}}
									</view>
								</view>
							</view>
						</view>
					</view>
					<!-- 红包展示页面 -->
					<view style="background-color: #FFFFFF;padding: 0;">
						<view v-if="item.msg.type == 'txt'&&item.ext.type==1" class="bubble red-envelope" @tap="openRedEnvelope(item)"
						 style="position: relative;">
						 
							<view v-if="myname==item.yourname">
								<image v-show="item.colorimg==false" src="/static/moneybao/duifanghongbaodise.png" style="width: 240px;height: 90px;transform: rotateY(2700deg);"></image>
								<image v-show="item.colorimg==true" src="/static/moneybao/qiangwan.png" style="width: 240px;height: 90px;transform: rotateY(2700deg);"></image>
							</view>
							<view v-if="myname!=item.yourname">
								<image v-show="item.colorimg==false" src="/static/moneybao/duifanghongbaodise.png" style="width: 240px;height: 90px;"></image>
								<image v-show="item.colorimg==true" src="/static/moneybao/qiangwan.png" style="width: 240px;height: 90px;"></image>
							</view>
							<view class="tis">
							</view>
							<view>
								<image src="/static/moneybao/hongbao.png" style="width: 30px;height: 40px;position: absolute;top: 24px;left: 20px;"></image>
							</view>
							<view class="blessing" style="position: absolute;bottom: 50px;left: 30%;font-size: 15px;color: #FFFFFF;">
								金额:{{ item.ext.money }}&nbsp;&nbsp;&nbsp;包数:{{ item.ext.num }}<br>雷值:{{ item.ext.beizhu }}
							</view>
							<view style="width: 242px;color: #000000;position: absolute;bottom: 2px;font-size: 18px;background-color: #FFFFFF;display: flex;border-bottom-left-radius: 8px;border-bottom-right-radius: 8px;justify-content: space-between;">
								<view style="margin-left: 5px;font-size: 14px;">积分红包</view>
								<view style="display: flex;margin-right: 5px;">
									<view class="" style="margin-right: 5px;font-size: 12px;">
										{{item.ext.time}}
									</view>
								</view>
							</view>
						</view>
					</view>
					<!-- 遮罩层 -->
					<view class="windows" :class="windowsState">
						<!-- 遮罩层 -->
						<view class="mask" @touchmove.stop.prevent="discard" @tap="closeRedEnvelope"></view>
						<view class="layer" @touchmove.stop.prevent="discard">
							<view class="open-redenvelope">
								<view class="top">
									<view class="close-btn">
										<view class="icon close" @tap="closeRedEnvelope"></view>
									</view>
									<image :src="touxiang"></image>
								</view>
								<!-- <view class="from">来自{{redenvelopeData.from}}</view>
								<view class="blessing">{{redenvelopeData.blessing}}</view>
								<view class="money">{{redenvelopeData.money}}</view> -->
								<!-- 领取按钮 -->
								<view v-show="isKai" style="width: 80px;height: 80px;text-align: center;border-radius: 17%;font-size: 25px;background-color: #EBCD99;line-height: 80px;text-align: center;display: flex;justify-content: center;margin-left: 50%;transform: translateX(-50%);margin-top: 30%;">
									<text @click="Grab(item)">開</text>
								</view>
								<view v-show="!isKai" style="padding-top: 50px; font-size: 20px; color:#EBCD99; text-align: center;">
									<text>积分不足，请充值后抢包</text>
								</view>
								
								<view class="showDetails" @tap="toDetails(item.info.to,item.ext.hb_id)" v-if="item.ext.type==1&&item.yourname==name">
									查看领取详情 <view class="icon to"></view>
								</view>
							</view>
						</view>
						
					</view>
				</view>
			</view>
		</view>
	</view>
	<!-- <view style="height: 1px;"></view> -->
</template>


<script>
	
	let msgType = require("../msgtype");
	let WebIM = require("../../../utils/WebIM")["default"];
	let msgStorage = require("../msgstorage");
	let disp = require("../../../utils/broadcast");
	let LIST_STATUS = {
		SHORT: "scroll_view_change",
		NORMAL: "scroll_view"
	};
	let page = 0;
	let Index = 0;
	let curMsgMid = '';
	let isFail = false;
	import audioMsg from "./type/audio/audio";
	import gbromarquee from '../../../components/gbro-marquee/marquee.vue';
	export default {
		data() {
			return {
				name:'',
				gundong:true,
				broadcastData: [],
				broadcastStyle: {
					speed: 1, //每秒3个字
					font_size: "32", //字体大小(rpx)
					text_color: "#FFFFFF", //字体颜色
					back_color: "#ff0000", //背景色
				},
				view: LIST_STATUS.NORMAL,
				toView: "",
				myname:'',
				totalfen:'',
				myusername:'',
				chatMsg: [],
				touxiang:'',
				__visibility__: false,
				isIPX: false,
				windowsState:'',
				isOwner:'',
				hbinfo:{},//红包的对象信息
				redenvelopeData:{
					rid:null,	//红包ID
					from:null,
					face:null,
					blessing:null,
					money:null
				},
				isKai:true
			};
		},
		onShow() {
			this.name = uni.getStorageSync('name')
			for (let i = 0; i < this.chatMsg.length; i++) {
				let token = uni.getStorageSync('token')
				uni.request({
					url: this.G_base + '/api/lz/ltzh',
					method: 'POST',
					header: {
						'content-type': 'application/x-www-form-urlencoded',
						'Authori-zation': 'Bearer ' + token
					},
					data: {
						list: this.chatMsg[i].yourname,
						status: 1,

					},
					processData: true,
					success: res => {
						this.chatMsg[i].headimg = res.data.data.useravatar
						this.chatMsg[i].nickname = res.data.data.nickname
					}
				})
			}
		
		},
		components: {
			audioMsg,gbromarquee
		},
		props: {
			username: {
				type: Object,
				default: () => ({})
			}
		},
		watch: {
			chatMsg(e) {
				for (let i = 0; i < this.chatMsg.length; i++) {
					let token = uni.getStorageSync('token')
					uni.request({
						url: this.G_base + '/api/lz/ltzh',
						method: 'POST',
						header: {
							'content-type': 'application/x-www-form-urlencoded',
							'Authori-zation': 'Bearer ' + token
						},
						data: {
							list: this.chatMsg[i].yourname,
							status: 1,

						},
						processData: true,
						success: res => {
							this.chatMsg[i].headimg = res.data.data.useravatar
							this.chatMsg[i].nickname = res.data.data.nickname
						}
					})
				}

			}
		},
		// lifetimes
		created() {},

		beforeMount() {
			this.__visibility__ = true;
			page = 0;
			Index = 0;
		},

		moved() {},

		destroyed() {
			this.__visibility__ = false;
		},

		mounted(event) {
			let me = this;
				let options = {
				    groupId: me.username.groupId           // 群组id                          
				};
				WebIM.conn.fetchGroupAnnouncement(options).then((res) => {
				    console.log(res.data,"群公告")
					me.broadcastData.push(res.data.announcement)
				})

			this.myusername = uni.getStorageSync('name')
			if (getApp().globalData.isIPX) {
				this.setData({
					isIPX: true
				});
			}

			let username = this.username;
			let myUsername = uni.getStorageSync("myUsername");
			let sessionKey = username.groupId ? username.groupId + myUsername : username.your + myUsername;
			let chatMsg = uni.getStorageSync(sessionKey) || [];

			this.renderMsg(null, null, chatMsg, sessionKey);
			uni.setStorageSync(sessionKey, null);
			disp.on('em.error.sendMsgErr', function(err) {
				curMsgMid = err.data.mid;
				isFail = true;
				return;
				console.log('发送失败了');
				let msgList = me.chatMsg;
				msgList.map(item => {
					if (item.mid.substring(item.mid.length - 10) == curMsgMid.substring(curMsgMid.length - 10)) {
						item.msg.data[0].isFail = true;
						item.isFail = true;
						me.setData({
							chatMsg: msgList
						});
					}
				});

				if (me.curChatMsg[0].mid == curMsgMid) {
					me.curChatMsg[0].msg.data[0].isShow = false;
					me.curChatMsg[0].isShow = false;
				}
				uni.setStorageSync("rendered_" + sessionKey, msgList);
			});
			msgStorage.on("newChatMsg", function(renderableMsg, type, curChatMsg, sesskey) {
				me.curChatMsg = curChatMsg;
				if (!me.__visibility__) return; // 判断是否属于当前会话

				if (username.groupId) {
					// 群消息的 to 是 id，from 是 name
					if (renderableMsg.info.from == username.groupId || renderableMsg.info.to == username.groupId) {
						if (sesskey == sessionKey) {
							me.renderMsg(renderableMsg, type, curChatMsg, sessionKey, 'newMsg');
						}
					}
				} else if (renderableMsg.info.from == username.your || renderableMsg.info.to == username.your) {
					if (sesskey == sessionKey) {
						me.renderMsg(renderableMsg, type, curChatMsg, sessionKey, 'newMsg');
					}
				}
			});
		},

		methods: {
			//查看领取红包的详情信息
			toDetails(qid,hbid){
				uni.navigateTo({
					url: '/pages/moreperson/moreperson?qid=' + qid+'&hbid='+hbid+'&zt='+1111
				})
				console.log(qid,hbid)
			},
			//跳转详情信息
			goinfofriend(msg){
				let myname = uni.getStorageSync('myUsername')
				var me = this;
				// 获取群信息
				var options = {
					groupId: me.username.groupId,
					success: function(resp) {
						if (resp && resp.data) {
							if (myname == resp.data[0].owner) {
								me.isOwner = true
							}else{
								me.isOwner = false
							}
							console.log(resp)
							uni.navigateTo({
								url: '/pages/groupfriendinfo/qunfriend?uid=' + msg.yourname + '&qid=' + me.username.groupId +
									'&q_id=' + me.username.qid + '&isOwner=' + me.isOwner
							})
						}
					},
					error: function() {}
				};
				WebIM.conn.getGroupInfo(options);
			},
			//抢红包详细信息
			Grab(msginfo){
				if(msginfo.ext.type==3){
					msginfo.colorimg = true
					uni.navigateTo({
						url:'/pages/moreperson/danperson/danperson?username='+JSON.stringify(msginfo.ext)
					})
					this.closeRedEnvelope();
				}else{
					this.groupid =this.username.groupId
					msginfo.colorimg = true
					uni.navigateTo({
						url:'/pages/moreperson/moreperson?username='+msginfo.username+'&hb_id='+JSON.stringify(this.hbinfo)+"&owner="+this.owner+"&groupid="+this.groupid
					})
					this.closeRedEnvelope();
				}
			},
			//抢红包
			openRedEnvelope(msg,index){
				if(msg.ext.type==3){
					let token = uni.getStorageSync("token")
					uni.request({
						url: this.G_base + '/api/lz/dhzs',
						method: 'POST',
						header: {
							'content-type': 'application/x-www-form-urlencoded',
							'Authori-zation': 'Bearer ' + token
						},
						data: {
							id:msg.ext.hb_id
						},
						success: res => {
							console.log(res)
							if(res.data.data.status==123){
								uni.navigateTo({
									url:'/pages/moreperson/danperson/danperson?username='+JSON.stringify(msg.ext)
								})
								this.closeRedEnvelope();
							}
						}
					})
					uni.request({
						url: this.G_base + '/api/IsDraw',
						method: 'POST',
						header: {
							'content-type': 'application/x-www-form-urlencoded',
							'Authori-zation': 'Bearer ' + token
						},
						data: {
							hb_id: msg.ext.hb_id,
							account: msg.username
						},
						success: res => {
							console.log(res)
							this.touxiang = res.data.data.avatar
							this.is_jbj = res.data.data.is_jbj
							if (this.is_jbj!=1) return;
							if (res.data.data.is_true != 0) {
								msg.colorimg = true
								uni.navigateTo({
									url:'/pages/moreperson/danperson/danperson?username='+JSON.stringify(msg.ext)
								})
								this.closeRedEnvelope();
							} 
						}
					})
					// this.windowsState = 'show';
					// let token = uni.getStorageSync("token")
					// uni.request({
					// 	url: this.G_base + '/api/lz/dhzs',
					// 	method: 'POST',
					// 	header: {
					// 		'content-type': 'application/x-www-form-urlencoded',
					// 		'Authori-zation': 'Bearer ' + token
					// 	},
					// 	data: {
					// 		id:msg.ext.hb_id
					// 	},
					// 	success: res => {
					// 		console.log(res)
					// 		msg.colorimg = true
					// 		// uni.navigateTo({
					// 		// 	url:'/pages/moreperson/moreperson?username='+msg.username+'&hb_id='+JSON.stringify(msg.ext)+"&owner="+this.owner+"&groupid="+this.groupid
					// 		// })
					// 		this.windowsState = 'hide';
					// 		this.closeRedEnvelope();
					// 	}
					// })
					return
				}else{
					this.groupid =this.username.groupId
					console.log(msg)
					this.myname = uni.getStorageSync('myUsername')
					uni.showLoading({
						title:'加载中...'
					});
					uni.hideLoading();
					let options = {
					    groupId: msg.username    // 群组id
					};
					WebIM.conn.getGroupInfo(options).then((res) => {
					    console.log(res)
						this.owner = res.data[0].owner
					})
					if(this.myname!=this.owner&&msg.ext.type!=1){//type==1可发可抢  type==0禁抢埋雷
						let token = uni.getStorageSync("token")
						uni.request({
							url: this.G_base + '/api/lz/jfqadd',
							method: 'POST',
							header: {
								'content-type': 'application/x-www-form-urlencoded',
								'Authori-zation': 'Bearer ' + token
							},
							data: {
								qid: msg.username,
								hb_id: msg.ext.hb_id,
								ck_status: 1
							},
							success: res => {
								msg.colorimg = true
								uni.navigateTo({
									url:'/pages/moreperson/moreperson?username='+msg.username+'&hb_id='+JSON.stringify(msg.ext)+"&owner="+this.owner+"&groupid="+this.groupid
								})
								this.windowsState = 'hide';
								this.closeRedEnvelope();
							}
						})
						return
					}else{
						// lz/jfuserqb
						this.hbinfo = msg.ext
						let token = uni.getStorageSync("token")
						uni.request({
							url: this.G_base + '/api/IsDraw',
							method: 'POST',
							header: {
								'content-type': 'application/x-www-form-urlencoded',
								'Authori-zation': 'Bearer ' + token
							},
							data: {
								hb_id: msg.ext.hb_id,
								account: msg.yourname
							},
							success: res => {
								console.log(12,res)
								this.touxiang = res.data.data.avatar
								this.is_jbj = res.data.data.is_jbj
								this.is_true = res.data.data.is_true
								if (this.is_jbj == 0 && this.is_true == 0){
									this.isKai = false;
									this.windowsState = 'show';
									return;
								}
								if(this.is_true == 0 &&this.is_jbj == 1){
									this.isKai = true;
									this.windowsState = 'show';
									return;
								}
								if (this.is_jbj == 1) {
									msg.colorimg = true
									uni.navigateTo({
										url:'/pages/moreperson/moreperson?username='+msg.username+'&hb_id='+JSON.stringify(this.hbinfo)+"&owner="+this.owner+"&groupid="+this.groupid
									})
									this.closeRedEnvelope();
								} 
							}
						})
						// this.windowsState = 'show';	
					}
				}
				
			},
			// 关闭红包弹窗
			closeRedEnvelope(){
				this.windowsState = 'hide';
				setTimeout(()=>{
					this.windowsState = '';
				},200)
			},
			//撤回消息
			msglongtap(msg) {
				let option = {
					mid: msg.mid,
					to: msg.info.to,
					type: msg.chatType
				}
				console.log(option)
				WebIM.conn.recallMessage(option)
			},
			normalScroll() {
				this.setData({
					view: LIST_STATUS.NORMAL
				});
			},
			//关闭
			guanbi(){
				this.$refs.son.change();
			},
			shortScroll() {
				this.setData({
					view: LIST_STATUS.SHORT
				});
			},

			onTap() {
				this.$emit("msglistTap", null, {
					bubbles: true
				});
			},

			previewImage(event) {
				var url = event.target.dataset.url;
				uni.previewImage({
					urls: [url] // 需要预览的图片 http 链接列表

				});
			},

			getHistoryMsg() {
				let me = this;
				let username = this.username;
				let myUsername = uni.getStorageSync("myUsername");
				let sessionKey = username.groupId ? username.groupId + myUsername : username.your + myUsername;
				let historyChatMsgs = uni.getStorageSync("rendered_" + sessionKey) || [];

				if (Index < historyChatMsgs.length) {
					let timesMsgList = historyChatMsgs.slice(-Index - 10, -Index);
					
						me.chatMsg = timesMsgList.concat(me.chatMsg),
						me.toView = timesMsgList[timesMsgList.length - 1].mid
					Index += timesMsgList.length;

					if (timesMsgList.length == 10) {
						page++;
					}

					uni.stopPullDownRefresh();
				}
			},

			renderMsg(renderableMsg, type, curChatMsg, sessionKey, isnew) {
				let me = this;
				let option = {
				    groupId: this.username.groupId    // 群组id
				};
				WebIM.conn.getGroupInfo(option).then((res) => {
				    console.log(res)
					this.owner = res.data[0].owner
					this.myname = uni.getStorageSync('myUsername')
				})
				var historyChatMsgs = uni.getStorageSync("rendered_" + sessionKey) || [];
				// if (curChatMsg.length) {
				// 	console.log(curMsgMid.substring(curMsgMid.length - 10) , curChatMsg[0].mid.substring(curChatMsg[0].mid.length - 10))
				// }
				// if(curChatMsg.length && curMsgMid.substring(curMsgMid.length - 10) == curChatMsg[curChatMsg.length - 1].mid.substring(curChatMsg[0].mid.length - 10)){
				// 	//curChatMsg[curChatMsg.length - 1].msg.data[0].isSuc = true
				// 	curChatMsg[curChatMsg.length - 1].isSuc = true
				// }
				var options = {
				    queue: this.username.groupId,
				    isGroup: true,
				    count: 10,
				    success: function(res){
						console.log('拉去服务器消息',res)
						// let src = '/static/musice.mp3';
						// 				//实例化声音  
						// 				const Audio = uni.createInnerAudioContext();
						// 				Audio.autoplay = true;
						// 				Audio.src = src; //音频地址  
						// 				Audio.play(); //执行播放  
						// 				Audio.onError((res) => {
						// 					console.log(res.errMsg);
						// 					console.log(res.errCode);
						// 				});
						// 				Audio.onPause(function() {
						// 					console.log('end');
						// 					Audio.destroy();
						// 				});
					},
				    fail: function(){}
				}
				WebIM.conn.fetchHistoryMessages(options)
				historyChatMsgs = historyChatMsgs.concat(curChatMsg); //console.log('当前历史',renderableMsg)
				console.log("当前的消息",renderableMsg)
				console.log("历史消息",historyChatMsgs)
				console.log(this.username)
				let token = uni.getStorageSync('token')
				uni.request({
					url: this.G_base + '/api/lz/quserfOne',
					method: "POST",
					header: {
						'content-type': 'application/x-www-form-urlencoded',
						'Authori-zation': 'Bearer ' + token
					},
					data: {
						account: this.username.myName,
						id:this.username.qid
					},
					success: (res) => {
						console.log('当前积分',res)
						renderableMsg.totalfen=res.data.data.integral
						this.totalfen = res.data.data.integral
					},
					fail: (err) => {
						console.log(err)
					}
				});
				if(renderableMsg!=null){
					// if(renderableMsg.ext.cs==1){
					// 	console.log("发送消息12");
					// 	let id = WebIM.conn.getUniqueId();
					// 	let msg = new WebIM.message(msgType.TEXT, id);
					// 	// let msg = new WebIM.message('txt', id);
					// 	let sb=JSON.parse(renderableMsg.ext.sb);
					// 	msg.set({
					// 		msg: "中雷赔付",
					// 		from: sb[0],
					// 		to:renderableMsg.ext.fb,
					// 		ext: {
					// 			title:'中雷赔付',
					// 			money:renderableMsg.ext.pmoney,
					// 			status:2
					// 		},
					// 		roomType: false,
					// 		chatType: 'singleChat',
					// 		success:function(id, serverMsgId) {
					// 			console.log("中雷赔付全局")
					// 			disp.fire("em.chat.sendSuccess", id, me.userMessage);
					// 		},
					// 		fail:function(e){
					// 			console.log(e)
					// 			console.log("失败了");
					// 			console.log(msg)
					// 		}
					// 		// fail(id, serverMsgId) {
					// 		// 	console.log("失败了");
					// 		// 	console.log(msg)
					// 		// },
					// 	});
					// 	WebIM.conn.send(msg.body);
					// 	console.log("发送消息成功zhonglei")
					// 	try {
					// 		WebIM.conn.send(msg.body);
					// 		console.log("发送消息成功！！！！")
					// 		let obj = {
					// 			msg: msg,
					// 			type: msgType.TEXT,
					// 		};
					// 		msgStorage.saveMsg(obj.msg, obj.type);
					// 	} catch (error) {
					// 		console.log("error", error);
					// 	}
					// }
					if(renderableMsg.ext.type==0){
						let token = uni.getStorageInfoSync('token')
						uni.request({
							url: this.G_base + '/api/lz/jfqadd',
							method: 'POST',
							header: {
								'content-type': 'application/x-www-form-urlencoded',
								'Authori-zation': 'Bearer ' + token
							},
							data: {
								qid:renderableMsg.username,
								hb_id: renderableMsg.ext.hb_id,
							},
							success: res => {
								console.log(res)
								renderableMsg.colorimg = true
							}
						})
					}
				}
					
				if (!historyChatMsgs.length) return;

				if (isnew == 'newMsg') {
						me.chatMsg=me.chatMsg.concat(curChatMsg),
						// 跳到最后一条
						me.toView=historyChatMsgs[historyChatMsgs.length - 1].mid

				} else {

						me.chatMsg=historyChatMsgs.slice(-10),
						// 跳到最后一条
						me.toView=historyChatMsgs[historyChatMsgs.length - 1].mid

				}
				uni.setStorageSync("rendered_" + sessionKey, historyChatMsgs);
				let chatMsg = uni.getStorageSync(sessionKey) || [];
				chatMsg.map(function(item, index) {
					curChatMsg.map(function(item2, index2) {
						if (item2.mid == item.mid) {
							chatMsg.splice(index, 1);
						}
					});
				});
				uni.setStorageSync(sessionKey, chatMsg);
				Index = historyChatMsgs.slice(-10).length;
				uni.pageScrollTo({
					scrollTop: 5000,
					duration: 300,
				});

				if (isFail) {
					this.renderFail(sessionKey);
				}
			},

			renderFail(sessionKey) {
				let me = this;
				let msgList = me.chatMsg;
				msgList.map(item => {
					if (item.mid.substring(item.mid.length - 10) == curMsgMid.substring(curMsgMid.length - 10)) {
						item.msg.data[0].isFail = true;
						item.isFail = true;
						me.setData({
							chatMsg: msgList
						});
					}
				});

				if (me.curChatMsg[0].mid == curMsgMid) {
					me.curChatMsg[0].msg.data[0].isShow = false;
					me.curChatMsg[0].isShow = false;
				}

				uni.setStorageSync("rendered_" + sessionKey, msgList);
				isFail = false;
			}

		}
	};
</script>
<style lang="scss">
	@import "@/static/HM-chat/css/style.scss"; 
	@import "./msglist.css";
	.showDetails{
		margin-bottom: 50px;
	}
</style>
